var spans = document.querySelectorAll('header>span');
var uls = document.querySelectorAll('ul');
for(var i = 0 ;i < spans.length ;i++){
    spans[i].onmouseenter = function(){
        // 所有span 删除样式类 current;
        for(var j = 0 ; j<spans.length ;j++){
            spans[j].className = '';
        }
        // 当前span添加样式类 current;
        this.className = 'current';
        
         //所有的ul display :none
         for(var j = 0 ; j< uls.length ;j++){
             uls[j].style.display = 'none';
         }
        // 对应的ul display：block
        var index = this.dataset.index;
        console.log(index);
        uls[index-1].style.display = 'block';
    }
}
// 怎么找到span对应的ul？？
// 可以通过给span添加data-index属性，记录span的序号
//鼠标进入的时候，获取this.dataset.index，就是当前span的
// 序号,也就是对应ul的序号